<template>
    <a-form-item
        class="Input"
        :label="fromItemOption.label"
        :name="fromItemOption.name"
        :placeholder="`请输入${ fromItemOption.label }!`"
        :rules="[{ required: true, message: `请输入${ fromItemOption.label }!` }]"
       
    >
        <a-input
            v-model:value="formState[fromItemOption.name]"
            @blur="updateFormState"
        />
    </a-form-item>
</template>

<script setup>
import {
  toRefs,
  watch,
} from 'vue';

import useCom from '@/store/com';

const comStore = useCom();

const props = defineProps({
    fromItemOption: {
        type: Object,
        required: true,
    },
    formState: {
        type: Object,
        required: true,
    }
});

const { formState, fromItemOption } = toRefs(props);

const updateFormState = () => {
    comStore.updateSelectedComFromState(formState.value);
}
</script>

<style lang="less" scoped>
.Input{
    
}
</style>